const CompressionPlugin = require("compression-webpack-plugin"); // gzip压缩 优化加载速度

//引入路径模块
const path = require("path");
const resolve = dir => {
    return path.join(__dirname, dir);
};

//引入等比适配插件
const px2rem = require("postcss-px2rem");
//配置基本大小
const postcss = px2rem({
    remUnit: 16 // 基准大小 baseSize，需要和rem.js中相同
});

module.exports = {
    lintOnSave: false, //是否在保存的时候使用 `eslint-loader` 进行检查
    // publicPath: "/",
    // nacos开启后打包配置
    // outputDir: "Node_Server/public",
    // assetsDir: "nacos-web/assets",

    productionSourceMap: false, //生产环境是否生成 sourceMap 文件
    devServer: {
        port: 30002, //前端端口
        open: true, //配置自动启动浏览器
        overlay: {
            //是否在浏览器上全屏显示编译的errors或warnings
            warning: false,
            errors: false
        }
    },
    chainWebpack: config => {
        // 路径别名配置
        config.resolve.alias
            .set("@", resolve("src"))
            .set("@v", resolve("src/views"))
            .set("@c", resolve("src/components"))
            .set("@l", resolve("src/library"));
        config.module
            .rule("js")
            .include.add([resolve("node_modules"), resolve("src")])
            .end()
            .use("babel")
            .loader("babel-loader")
            .tap(options => {
                return options;
            });
        // 生产环境，开启js\css等压缩
        if (process.env.NODE_ENV === "production") {
            config.plugin("compressionPlugin").use(
                new CompressionPlugin({
                    test: /\.(js|css|less|css|json)$/, // 匹配文件名
                    threshold: 10240, // 对超过10240k的数据压缩
                    minRatio: 0.8,
                    deleteOriginalAssets: true // 删除源文件
                })
            );
        }
    },
    pages: {
        index: {
            entry: "src/main.js", //文件入口
            template: "public/index.html", //模板文件
            filename: "index.html" //输出文件
        }
    },
    css: {
        loaderOptions: {
            //预处理
            less: {
                javascriptEnabled: true
            },
            postcss: {
                plugins: [postcss]
            }
        },
        // 是否使用css分离插件 ExtractTextPlugin
        extract: true,
        // 开启 CSS source maps
        sourceMap: false,
        // 启用 CSS modules for all css / pre-processor files.
        modules: false
    },
    pluginOptions: {
        "style-resources-loader": {
            preProcessor: "less",
            patterns: [path.resolve(__dirname, "src/style/index.less")]
        }
    }
};
